<template>
    <div class="set_info">
        <div class="title">设置参会人信息</div>
        <div class="info">
            <div class="content">
                <span>您的姓名：</span>
<!--                <input type="text" v-model="realname">-->
                <button class="sign" @click="toSign">手写签名</button>
                <button @click="showInputTextModal" class="sign">
                    <!--<navigator url="../sign/sign" open-type="navigate">文字录入</navigator>-->
                    文字录入
                </button>
            </div>
            <div style="width: 100%;text-align: center;margin: 0 auto;color: white">
                <div v-if="realname != ''">参会人：<span>{{realname}}</span></div>
                <div v-if="realnameUrl != ''"><img :src="realnameUrl" style="width: 200px" mode="widthFix" /></div>
            </div>
            <div class="content">
                <span>参会模式：</span>
                <radio-group @change="bindRadioChange">
                    <label class="radio">
                        <radio value="0" :checked="radioList[0]" style="transform:scale(0.8)" />现场
                    </label>
                    <label class="radio">
                        <radio value="1" :checked="radioList[1]" style="transform:scale(0.8)" />远程
                    </label>
                </radio-group>
            </div>
            <div class="send" @click="setUserRealname">下一步</div>
        </div>

        <modal v-if="inputModal" title="文字录入" confirm-text="确定" cancel-text="取消" @cancel="inputModal = false" @confirm="confirmInput()">
            <input type='text' placeholder="请输入你的名字" v-model="tempName" />
        </modal>

    </div>
</template>

<script>

    export default {
        name: "setRealname",
        data(){
            return{
                realname:"",
                realnameUrl:"",
                realnameImgId:0,
                radioList: [true,false],
                joinmode : "0",
                inputModal: false,
                tempName: '',
            }
        },
        onShow(){
            this.getUserInfo();
            if(uni.getStorageSync('base64_img_id') != ""){
                this.realnameImgId = uni.getStorageSync('base64_img_id')
            }
            if(uni.getStorageSync('base64_img_url') != ""){
                this.realnameUrl = uni.getStorageSync('base64_img_url')
            }
			if(uni.getStorageSync('realname')!=''){
				this.realname=uni.getStorageSync('realname')
			}

        },
        methods:{
            bindRadioChange(e){
                this.joinmode = e.detail.value;
            },
            async getUserInfo(){
                let params = {
                    user_token: uni.getStorageSync('userToken'),
                }
                let res = await this.$api.getUserInfo(params);
                if(res.data.level == "success"){
                    if(res.data.data != ''){
							if(uni.getStorageSync('realname')!=''){
								this.realname=uni.getStorageSync('realname')
							}else{
								this.realname = res.data.data.realname;
							}
					
                        if(this.realnameImgId == 0 || this.realnameImgId == ""){
                            this.realnameImgId = res.data.data.sign_img_id;
                        }
                        if(this.realnameUrl == ""){
                            this.realnameImgId = res.data.data.sign_img_url;
                        }
                        this.index = res.data.data.mode;
                        this.radioList[this.index] = true;
                    }else {
                        this.radioList[0] = true;
                    }
                }else{
                    uni.showToast({
                        title: res.data.message,
                        icon: 'none',
                        duration: 1000
                    })
                }
            },
            async setUserRealname(){
                uni.setStorageSync('mode',this.joinmode);
				uni.removeStorageSync('realname')
                let params = {
                    realname:this.realname,
                    sign_img_id:this.realnameImgId,
                    user_token: uni.getStorageSync('userToken'),
                }
                let res = await this.$api.setUserRealname(params);
                if(res.data.level == "success"){
                    this.getNowMeetingContent()
                }else{
                    uni.showToast({
                        title: res.data.message,
                        icon: 'none',
                        duration: 1000
                    })
                }
            },
            //获取当前会议内容
            async getNowMeetingContent(key='',link_id='',content_id=''){
                let params = {
                    key:uni.getStorageSync('key'),
                }
                let res = await this.$api.getNowMeetingContent(params);
                if(res.data.level == "success"){
                    uni.navigateTo({
                        url:"/pages/attendee/attendee"
                    })
                }else{
                    uni.showToast({
                        title: res.data.message,
                        icon: 'none',
                        duration: 1000
                    })
                }
            },

            //显示输入文字模态框
            showInputTextModal() {
                this.inputModal = true
            },

            confirmInput() {
                this.realname = this.tempName
				uni.setStorageSync('realname',this.realname)
                this.inputModal = false
            },

            toSign(){
                uni.navigateTo({
                    url:"/pages/sign/sign"
                })
            }

        }
    }
</script>

<style lang="scss" scoped>
    .set_info {
        width: 100vw;
        min-height: 100vh;
        background-color: #da2424;
        /*background: url("http://file.rzkeji.com/web/dang/wxapp/back.png") no-repeat;*/
        background-size: 100%;
        .title{
            text-align: center;
            width: 100%;
            color: white;
            top: 20px;
            position: fixed;
        }

        .info{
            position: fixed;
            top: 60px;
            padding: 10px;
            width: 100%;

            .content{
                top: 80rpx;
                padding: 20rpx 0;
                width: 100%;
                display: flex;
                align-items: center;
                span{
                    width: 200rpx;
                    color: white;
                }
                margin: 30rpx 0;
                label{
                    color: #ffda2f;
                    margin: 0 30rpx;
                    vertical-align: middle;
                }
                input{
                    width: 30%;
                    border-bottom: 1px solid #ffda2f;
                    color: #ffda2f;
                }
                .sign{
                    padding: 3px;
                    width: 30%;
                    /* width: 100px; */
                    height: 40px;
                    font-size: 1rem;
                    line-height: 36px;
                    background-color: #f0860b;
                    color: white;
                }
            }

            .send{
                width: 100%;
                height: 80rpx;
                line-height: 80rpx;
                text-align: center;
                color: #FFFFFF;
                background-color: #f0860b;
                border-radius: 12rpx;
                margin-top: 50rpx;
            }
        }
    }
</style>
